<template>
	<div class="order-details-component bottom-ash-line">
		<ul class="bottom-ash-line">
			<li>
				<span>订单编号：</span>
				<span>{{ordernumber}}</span>
			</li>
			<li v-if="createtime && userInfo.groupid!=5">
				<span>下单时间：</span>
				<span>{{createtime}}</span>
			</li>
			<li v-if="userInfo.groupid==5">
				<span>提交人：</span>
				<span>{{item.userzhicheng}}</span>
			</li>
			<li v-if="userInfo.groupid==5">
				<span>提交时间：</span>
				<span>{{createtime}}</span>
			</li>
			<li v-if="userInfo.groupid==5">
				<span>会计确认时间：</span>
				<span>{{item.kuaijitime}}</span>
			</li>
			<li v-if="userInfo.groupid==5">
				<span>入库时间：</span>
				<span>{{completeTime?completeTime:'无'}}</span>
			</li>
			<li v-if="deposit">
				<span>暂存点：</span>
				<span>{{deposit}}</span>
			</li>
			<li v-if="collectPeople">
				<span>收取业务员：</span>
				<span>{{collectPeople}}</span>
			</li>
			<li v-if="collectTime">
				<span>收取时间：</span>
				<span>{{collectTime}}</span>
			</li>
			<li v-show="completeTime">
				<span>完成时间：</span>
				<span>{{completeTime}}</span>
			</li>
			<li v-show="cancelTime">
				<span>取消时间：</span>
				<span>{{cancelTime}}</span>
			</li>
		</ul>
		<!--        已取消订单不显示-->
		<ul v-if="completeTime">
			<li>
				<span>资金到账：</span>
				<span>{{capital}}</span>
			</li>
			<li>
				<span>收取方式：</span>
				<span>{{mode}}</span>
			</li>
		</ul>
	</div>
</template>

<script>
	export default {
		name: "order-details-component",
		props: ['ordernumber', 'createtime', 'deposit', 'collectPeople', 'collectTime', 'cancelTime', 'completeTime', 'capital', 'mode','item'],
		data() {
			return {

			}
		},
		computed:{
			userInfo(){
				return this.$store.state.options.user.oda
			}
		}
	}
</script>

<style lang="scss" scoped>
	.order-details-component {
		ul {
			padding: 1rem;

			li {
				display: flex;
				font-size: 1.4rem;
				color: #999999;
				margin: 1rem 0;

				span {
					display: block;
                }
                
				span:first-child {
                    // flex: 0 0 96px;
					 width: 30%;
					text-align: right;
                }
                
				span:last-child {
                    flex: 1;
					/*width: 70%;*/
					margin-left: 1rem;
					color: #333333;
				}
			}
		}
	}
</style>
